<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml"></html>
	<head>
		<meta charset="UTF-8">
		<title>宠雨秒杀</title>
		<link rel="stylesheet" type="text/css" href="./layui/css/layui.css">
		<!-- <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"> -->
	</head>

	<body style="background-color: #FAFAFA;">

		<script src="https://www.jq22.com/jquery/1.11.1/jquery.min.js"></script>
		<script src="js/jquerysession.js"></script>
		<script src="./layui/layui.all.js"></script>

		<!-- 导航栏 -->
		<div class="layui-layout layui-layout-admin">
			<div class="layui-header">
				<!-- 设置logo -->
				<div class="layui-logo">
					<a style="color: dodgerblue;" href="main.html">ChongYu SeckKill</a>
				</div>
				<!-- 左边导航栏 -->
				<ul class="layui-nav layui-layout-left">
					<li class="layui-nav-item">
						<a href="main.html">首页</a>
					</li>
				</ul>
				<!-- 右边导航栏 -->
				<ul id="view" class="layui-nav layui-layout-right">
					<li class="layui-nav-item">
						<a href="index.html">立即登录</a>
					</li>
				</ul>
			</div>
		</div>

    <!-- 生成替换模板 -->
		<script id="user" type="text/html">
		 <li class="layui-nav-item">
			 <a href="person.html">修改信息</a>
		 </li>
		 <li class="layui-nav-item">
			<a href="password.html">修改密码</a>
		</li>
		<li class="layui-nav-item  layui-this">
			<a href="personlist.html">购物记录</a>
		</li>
		<li class="layui-nav-item">
			<a onclick="loginout()">注销退出</a>
		</li>
		</script>

		<!-- 准备修改个人用户的数据信息 -->
		<div style="margin: top 100px;">
			<table lay-even lay-skin="row" lay-size="lg" class="layui-table">
				<thead>
				<tr>
					<th><a style="color: forestgreen;">商品名称</a></th>
					<th><a style="color: saddlebrown;">商家名称</a></th>
					<th><a style="color: coral;">商品价格</a></th>
					<th><a style="color: maroon;">订单状态</a></th>
					<th><a style="color: orangered;">订单时间</a></th>
				</tr> 
				</thead>
				<tbody id="infotable">
					<tr align="center">
						<td colspan="5"  >
							<h3>无购物记录</h3>
						</td>
					</tr>
				</tbody>
			</table>
		</div>

		<!-- 配置导航栏信息 -->
		<script>
			function loginout() {
				$.session.clear();
				window.location.href = 'main.html';
			}

			$(toview())


			function toview() {
				//第三步：渲染模版
				var laytpl = layui.laytpl;

				var getTpl = user.innerHTML,
					view = document.getElementById('view'),
					data = $.session.get("user");

				if (data != null) {
					laytpl(getTpl).render(JSON.parse(data), function(html) {
						view.innerHTML = html;
					});
				}
			}

			$(renderOrder())

			//同步加载商品数据
			function renderOrder() {

				var userdata =JSON.parse($.session.get("user"));

				$.ajax({
					async: false,
					method: "post",
					url: '/product/getorder',
					data: {"uid": userdata.id},
					dataType: 'json',
					success: function(result) {
						console.info(result);
						resData = result.data.data;
						console.log(resData);
						renderOrderHtml(resData);
					}
				});
			}

			function checkTime(i){
				if (i<10){
					i="0" + i
				}
				return i;
			}

			function changedatetime(date) {
				return date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate() + ' ' + checkTime(date.getHours()) + ':' + checkTime(date.getMinutes()) + ':' + checkTime(date.getSeconds());
			}

			// 点击商家名称弹出商家的手机号
			function getBussinessphone(bid){
				$.ajax({
					async: false,
					method: "post",
					url: '/business/getphone',
					data: {"bid": bid},
					dataType: 'json',
					success: function(result) {
						console.info(result);
						var phone = JSON.stringify(result.data.data);
						alert("该商家的联系电话为: "+phone+" ,有任何问题请及时联系！");
					}
				});
			}

			// 点击商家名称弹出商家的手机号
			function gotozhifuagain(a,b,c){
				window.location.href = '/alipay/pay?WIDout_trade_no='+a+"&WIDtotal_amount="+b+"&WIDsubject="+c+"&WIDbody=";
			}


			//渲染展示商品的html页面
			function renderOrderHtml(data) {
				var str = ""; //用来存储html内容
				if (data.length > 0) {
					$.each(data, function(v, o) {
						str += "<tr><td><a href='productDetail.html?product_id="+o.productId+"'>"+o.productName+"</a></td>";
						str += "<td><a href='javascript:;' onclick=getBussinessphone("+o.businessId+")>"+o.businessName+"</a></td>";
						str += "<td><a>"+o.totalPrice+" ¥</a></td>";
						if(o.orderStatus == 0){
							var pname = o.productName.replace(" ","-");
							str += "<td><a href='javascript:;' onclick=gotozhifuagain('"+o.id+"','"+o.totalPrice+"','"+pname+"')>立即支付</a></td>";
						}
						if(o.orderStatus == 1){
							str += "<td><a>等待发货</a></td>";
						}
						if(o.orderStatus == 2){
							str += "<td><a>货物已发</a></td>";
						}
						if(o.orderStatus == 3){
							str += "<td><a>订单超时</a></td>";
						}
						if(o.orderStatus == 4){
							str += "<td><a>支付异常</a></td>";
						}
						str += "<td><a>"+changedatetime(new Date(o.createTime))+"</a></td></tr>";
					});
					$("#infotable").html(str);
				}
			}
		</script>
</body>
</html>
